import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app03/ConfirmOrder.dart';
import 'getOrder.dart';

main(){
  runApp(MyApp());
}


class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      home: WaitingforPaymentState(),
    );
  }
}

class WaitingforPaymentState extends StatefulWidget{
  WaitingforPayment createState() => WaitingforPayment();
}

class WaitingforPayment extends State{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Color.fromRGBO(236,236,236, 1),
        appBar: AppBar(
            backgroundColor: Color.fromRGBO(51, 51, 51, 1),
            titleSpacing: 0.0,
            title:Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                FlatButton(
                  materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                  child: Row(
                    children: [
                      Icon(Icons.arrow_back_ios,color: Colors.white,),
                      Text('返回',style: TextStyle(color: Colors.white,fontSize: 16),)
                    ],
                  ),
                  onPressed:(){
                    Navigator.pop(context);
                  },
                ),
                Container(child: Row(children: [
                  Text('跑腿待付款详情',style: TextStyle(fontSize: 16),),
                  SizedBox(width: 25,)
                ],),),
                IconButton(icon: Icon(Icons.more_horiz), onPressed: (){})
              ],
            )
        ),
          body: Container(
            child: Column(
              children: <Widget>[
                //任务倒计时
                Container(
                  height: MediaQuery.of(context).size.height*0.095,//70
                  child:Row(
                    children: <Widget>[
                      Column(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Text("     任务已提交，请在30分钟内付款",style: TextStyle(fontWeight: FontWeight.bold,fontSize: 16),),
                          Text("     付款截止：20分18秒27",style: TextStyle(fontSize: 16,),textAlign: TextAlign.left,)
                        ],
                      )
                    ],
                  ),
                  decoration: BoxDecoration(
                      color: Colors.white
                  ),
                ),
                SizedBox(height: 12,),
                //跑腿待付款（金额内容地址）
                Container(
                  padding: EdgeInsets.only(left: 15,right: 15,top:10 ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      //跑腿待付款
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          Text("跑腿",style: TextStyle(fontSize: 14),),
                          SizedBox(width: 280,),
                          Text("待付款",style: TextStyle(color: Colors.red,fontSize: 16),textAlign: TextAlign.right,)
                        ],
                      ),
                      SizedBox(height: 10,),
                      Text("任务主题（限制20字）",style: TextStyle(fontSize: 18),),
                      SizedBox(height: 20,),
                      //分割线
                      Divider(color: Color.fromRGBO(51, 51, 51, 0.5)),
                      //任务内容
                      Row(
                        children: <Widget>[

                          Icon(Icons.attach_money,color:Color.fromRGBO(51, 51, 51, 0.5),),

                          Text("  待支付：5元",style: TextStyle(fontSize: 16))
                        ],
                      ),
                      SizedBox(height: 10,),
                      Container(
                        width: MediaQuery.of(context).size.width*0.73,//300
                        child: Row(
                          children: <Widget>[
                            Icon(Icons.message,color:Color.fromRGBO(51, 51, 51, 0.5),),
                            Expanded(
                              child: Padding(
                                padding: EdgeInsets.only(left: 10,top: 12),
                                child: Text('任务任务任务任务任务任务任务任务任务任务任务任务',style: TextStyle(fontSize: 16),),
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 20,),
                      //分割线
                      Divider(color: Color.fromRGBO(51, 51, 51, 0.5)),
                      //发单人姓名地址电话
                      Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Icon(Icons.location_on,color:Color.fromRGBO(51, 51, 51, 0.5),),
                          Text("  发单人姓名         15688888888  ",style: TextStyle(fontSize: 16)),
                        ],
                      ),
                      SizedBox(height: 12,),
                      Text("          福建省厦门市",style: TextStyle(fontSize: 13)),
                      SizedBox(height: 30,),
                    ],
                  ),

                  decoration: BoxDecoration(
                      color: Colors.white
                  ),
                ),
                Spacer(),
                //付款按钮
                Container(
                    height: MediaQuery.of(context).size.height*0.068,//50
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: [
                      MaterialButton(
                        color: Color.fromRGBO(51, 51, 51, 0.3),
                        textColor: Colors.white,
                        child: new Text('付款'),
                        shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(3.0),
                            side: BorderSide(color: Colors.black,width: 0.5)),
                        onPressed: (){
                          showDialog(
                              context:context,
                              barrierDismissible: false,
                              builder: (BuildContext context){
                                return Dialogdemo();
                              }
                          );
                        },
                      ),
                      SizedBox(width: 20,)
                    ],
                  ),

                  color: Colors.white,
                ),
              ],
            ),
          ),
      ),
    );
  }
}
//------------------------------------------------------付款弹窗------------------------------------------------------
class Dialogdemo extends Dialog{
  Dialogdemo({Key key,}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Material(
      type: MaterialType.transparency,
      child: Center(
        child: SizedBox(
          width: MediaQuery.of(context).size.width*0.83,//340
          height:  MediaQuery.of(context).size.height*0.38,//280
          child: Container(
            padding: EdgeInsets.all(10),
            decoration: BoxDecoration(
                border: new Border.all(color: Colors.black, width: 0.5),
                borderRadius: BorderRadius.all(Radius.circular(15)),
                color: Colors.white),
            child: Column(
              children: <Widget>[
                //------支付-------
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    GestureDetector(
                      onTap: (){
                        Navigator.pop(context);
                      },
                      child:Container(
                        height: 35,
                        width: 35,
                        child: Icon(Icons.close,color: Colors.grey,),
                        decoration: BoxDecoration(
                            border: new Border.all(color: Colors.white, width: 1),
                            borderRadius: BorderRadius.all(Radius.circular(50)),
                            color: Colors.white
                        ),
                      ),
                    ),
                    SizedBox(width:0,),
                    Text("支付",style: TextStyle(fontWeight: FontWeight.bold,fontSize: 20),),
                    Text("使用密码",style: TextStyle(fontSize: 18,color: Colors.blue),),
                  ],
                ),
                Divider(color: Colors.green,),
                Text("跑腿",style: TextStyle(fontWeight: FontWeight.bold,fontSize: 17),),
                Text("¥5.00",style: TextStyle(fontWeight: FontWeight.bold,fontSize: 38),),
                SizedBox(height: 12,),
                //------建设银行卡-------
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      child: Row(
                        children: [
                          Image.network(
                            "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=705549836,3882006032&fm=26&gp=0.jpg",
                            width:20,//20
                            height: 40,//40
                          ),
                          Text("  建设银行储蓄卡(3057)",style: TextStyle(fontSize: 18,color: Colors.grey)),
                        ],
                      ),
                    ),
                    Icon(Icons.arrow_forward_ios,color: Colors.grey,size: 18,),
                  ],
                ),
                SizedBox(height: 15,),
                //------确认支付-------
                GestureDetector(
                  onTap: (){
                    Navigator.of(context).push(new MaterialPageRoute(builder: (BuildContext context){
                      return  GetOrder();
                    }));
                  },
                  child: Container(
                    width: MediaQuery.of(context).size.width*0.77,//320
                    height: MediaQuery.of(context).size.height*0.06,//44
                    decoration: BoxDecoration(
                      border: new Border.all(color: Colors.green, width: 5),
                      borderRadius: BorderRadius.all(Radius.circular(5)),
                      color: Colors.green,
                    ),
                    child: Text('确认支付',style: TextStyle(color: Colors.white,fontSize: 20),textAlign: TextAlign.center,),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}